<div class="febs-container">
    <div class="febs-component-body" id="febs-common-dept" lay-title="机构选择">
        <div class="layui-row febs-full" style="background: white;padding: 15px 10px;">
            <div class="layui-col-md12 layui-col-sm12 layui-col-xs12 febs-full">
                <div class="tree-container">
                    <div class="eleTree deptTree" lay-filter="deptTree" style=""></div>
                </div>
            </div>
        </div>
    </div>
</div>
<script data-th-inline="javascript">
    var commonDto = [[${commonDto}]];
</script>
<script data-th-inline="none" type="text/javascript">
    layui.use(['jquery', 'eleTree', 'form', 'table', 'febs'], function () {
        var $ = layui.jquery,
            form = layui.form,
            eleTree = layui.eleTree,
            _currentDeptData,
            $view = $('#febs-common-dept'),
            $query = $view.find('#query');
        let parentId = POPUP_DATA.parentId
        let tenantId = POPUP_DATA.tenantId
        let multiple = POPUP_DATA.multiple
        let selectList = POPUP_DATA.selectList
        form.render();

        renderMenuTree();

        function renderMenuTree() {
            eleTree.render({
                elem: '.deptTree',
                url: ctx + 'common/dept/tree',
                where: {
                    "invalidate_ie_cache": new Date(),
                    "tenantId": tenantId,
                    "parentId": parentId,
                    "status": "1",
                },
                accordion: false,
                highlightCurrent: true,
                showCheckbox: multiple ? true : false,
                checkStrictly: true,
                renderAfterExpand: false,
                expandOnClickNode: false,// 是否在点击节点的时候展开或者收缩节点， 默认值为 true，如果为 false，则只有点箭头图标的时候才会展开或者收缩节点。
                checkOnClickNode: multiple ? false : true,
                spread: true,
                defaultExpandAll:true,
                searchNodeMethod: function (value, data) {
                    if (!value) return true;
                    return data.title.indexOf(value) !== -1;
                },
                request: {
                    name: 'name',
                    key: "id",
                    checked: "checked",
                    data: 'data',
                },
                response: {
                    statusName: "code",
                    statusCode: 200,
                    dataName: "data",
                },
                done: function (data) {
                    _currentDeptData = undefined;
                    console.log(data)
                },
            });

            //return _menuTree;
        }

        let dataArr = [];
        //多选监听
        eleTree.on("nodeChecked(deptTree)", function (d) {
            var data = d.data.currentData.data;
            if (!data || data.deptId === undefined) {
                return;
            }
            let elem = $view.find('div[data-id="' + data.deptId + '"]');
            let checked = elem.find(".eleTree-checkbox");
            if (checked.hasClass("eleTree-checkbox-checked")) {
                if (dataArr.findIndex(item => item.deptId === Number(data.deptId)) === -1) {
                    dataArr.push(data)
                }
            } else {
                dataArr = dataArr.filter(item => item.deptId !== Number(data.deptId))
            }
            if (data.deptId != undefined && data.deptId > 0) {
                _currentDeptData = data;
                form.val("user-table-form", {
                    "deptId": data.deptId
                });
                $query.click();
            }
        });
        //单选监听
        eleTree.on("nodeClick(deptTree)", function (d) {
            var data = d.data.currentData.data;
            if (!data || data.deptId === undefined) {
                return;
            }
            dataArr.push(data);
        });

        window.getSelectData = function () {
            let returnData = null
            if (dataArr.length > 0) {
                if (!multiple) {
                    returnData = {
                        deptId: dataArr[0].deptId,
                        deptName: dataArr[0].deptName,
                        status: dataArr[0].status
                    }
                    if (null != selectList && valueExists(selectList, "deptId", returnData.deptId)) {
                        returnData = null
                    }
                } else {
                    returnData = []
                    $.each(dataArr, function (index, item) {
                        let deptItem = null
                        deptItem = {
                            deptId: item.deptId,
                            deptName: item.deptName,
                            status: item.status
                        }
                        if (null != selectList && valueExists(selectList, "deptId", item.deptId)) {
                            deptItem = null
                        }
                        if (null != deptItem) {
                            returnData.push(deptItem)
                        }
                    })
                }
            }

            return returnData;
        }

        function valueExists(arrayList, fieldName, value) {
            let result = $.grep(arrayList, function (e) {
                return e[fieldName] == value;
            })
            return result && result.length > 0;
        }
    })
</script>